<template>
	<div class="e1">
		<div class="listh">
			<i class="el-icon-s-data">书城管理 —— </i>
			<span> 热度图片</span>


		</div>
		<hr />
		<el-button style="color: white; background-color: #189F92;" @click="goadd()">添加热点商品</el-button>
		<el-table :data="list" class="t1">
			<el-table-column prop="memo" label="描述"></el-table-column>
			<el-table-column prop="type" label="类型"></el-table-column>
			<el-table-column prop="hot" label="热度"></el-table-column>
			<el-table-column label="图片">
				<template slot-scope="scope">
					<img :src="`${$ip}/api/public/showimg/${scope.row.picture}`" min-width="70" height="70"
						style="height: 50PX;width: 80px;" />
				</template>
			</el-table-column>
			<el-table-column label="操作">
				<template slot-scope="scope">
					<el-button style="background-color: #00BFFF;" @click="goupdate(scope.row)">修改</el-button>
					<el-button style="background-color: orange;" @click="remove(scope.row.id)">删除</el-button>
				</template>

			</el-table-column>
		</el-table>
	</div>
</template>

<script>
	export default {
		name: "hotlist",
		data() {
			return {
				list: []
			}
		},
		methods: {
			goadd() {
				let data = {
					id: 0,
				}
				this.$router.push({
					path: '/bookbackend/addAndupdate', //跳转的页面
					query: data, //跳转的页面,


				})
			},
			goupdate(a) {
				console.log(a);

				let data = {
					id: a.id,

				}

				this.$router.push({
					path: '/bookbackend/addAndupdate', //跳转的页面
					query: data, //跳转的页面,


				})
			},
			remove(id) {
				console.log(id);
				this.$get("/api/adm/hot/remove/" + id).then((resp) => {
					console.log(resp.data.data);
					this.show();
				})
			},
			show() {
				this.$get('/api/adm/hot/findAll').then((resp) => {
					this.list = resp.data.data;
					console.log(resp.data.data);
					console.log("list数组" + this.list);
				})
			}
		},
		mounted() {
			this.show();

		}
	}
</script>

<style>
	.e1 {
		width: 90%;
		margin-left: 2%;
		/* 	background-color: #00BFFF; */

	}

	.e1 table.t1 {
		text-align: center;
	}

	.e1 button {
		color: white;
	}

	.listh i {
		margin-left: 1%;
		margin-top: 3%;
		color: #bfb8b3;
	}



	.listh button {
		margin-left: 60%;
		color: black;
	}

	.e1.el-upload-list--picture .el-upload-list__item {
		width: 300px;
		margin: 0 auto;
	}
</style>